<!DOCTYPE html>
<html>
	<style>
	* {
		margin:0;
		padding:0;
	}
	 body {
		background-color:#0888ff;
	} 
	.wrap {
		margin-left:auto;
		margin-right:auto;
	}
	header {
		width:400px;
		font-size:0;
	}
	canvas {
		display:none;
		border-style:solid;
		border-width:10px;
		border-color:#FFFFFF;
	}
	canvas:focus {
		outline:none;
	}
	
	h1 {
		display:inline-block;
		width:140px;
		font-size:25px;
		color:#FFFFFF;
	}
	.live {
		display:inline-block;
		width:170px;
		font-size:20px;
		color:#FFFFFF;
		text-align:right;
	}
	.time {
		display:inline-block;
		width:90px;
		font-size:20px;
		color:#FFFFFF;
		text-align:right;
	}
	
	#gameover a,#setting a,#menu a {
		display:block;
	}
	#gameover a,#setting a:hover,#menu a:hover {
		cursor:pointer;
	}
	
	#menu {
		display:block;
		width:340px;
		padding-top:95px;
		padding-bottom:95px;
		font-size:40px;
		margin-left:auto;
		margin-right:auto;
		text-align:center;
		color:#FFF;
	}
	
	#gameover {
		display:none;
		width:340px;
		padding-top:95px;
		padding-bottom:95px;
		margin-left:auto;
		margin-right:auto;
		text-align:center;
		font-size:30px;
		color:#FFF;
	}
	#gameover p {
		margin-top:25px;
		font-size:30px;
	}
	#gameover a:hover::before,#menu a:hover::before {
		content:">";
		margin-right:10px;
	}
	#setting {
		display:none;
		width:340px;
		margin-left:auto;
		margin-right:auto;
		padding-top:85px;
		padding-bottom:85px;
		font-size:30px;
		color:#FFF;
		text-align:center;
	}
	#setting h2 {
		margin-bottom:15px;
	}
	#setting p {
		margin-top:10px;
	}
	#setting input {
		display:none;
	}
	#setting label {
		cursor:pointer;
	}
	#setting input:checked + label {
		background-color:#FFF;
		color:#ff0000;
	}
	</style>
	<head>
		<meta charset="utf-8">
		<title>雷霆战机</title>
	</head>
	<body>
		<header class="wrap">
		    <h1>雷霆战机</h1>
			<p class="time">时间: <span id="time_value">0</span></p>
		    <p class="live">生命值: <span id="live_value">0</span></p>
		</header>
		<canvas class="wrap" id="plane" width="781" height="586" tabindex="1" <!-- style="border:solid;" -->>
		    你的浏览器不支持canvas画布元素，请更新浏览器获得演示效果。
		</canvas>
		
		<div id="gameover">
		    <h2>游戏失败</h2>
		    <p class="endtime">游戏记录时间: <span id="endtime">0</span></p>
		    <a id="newgame_gameover">回到主菜单重新开始</a>
		</div>
		
		<div id="setting">
		    <h2>游戏设置</h2>
		    
		    <p>难度:
		        <input id="speed1" type="radio" name="speed" value="300" checked/>
		        <label for="speed1">易</label>
		        <input id="speed2" type="radio" name="speed" value="200" />
		        <label for="speed2">正常</label>
		        <input id="speed3" type="radio" name="speed" value="100" />
		        <label for="speed3">难</label>
		    </p>
			<p>生命值:
			    <input id="livetian" style="display: inline;height:35px;width: 100px;font-size: 25px;text-align:center;color: #ff0000;" value="10"/>  
			</p>
			<a id="newgame_setting">开始游戏</a>
		</div>
		
		<div id="menu">
		    <h2>雷霆战机</h2>
		    <a id="newgame_menu">开始新游戏</a>
			<a id="setting_menu">游戏设置</a>
		</div>
	</body>
	
	<script>
		//var can = document.getElementById("plane");
		
		var canvasWidth=781;
		var canvasHeight=586;
		var screen_plane;
		var screen_menu;
		var screen_setting;
		var screen_gameover;
		var button_newgame_menu;
		var button_newgame_setting;
		var button_newgame_gameover;
		var button_setting_menu;
		var button_setting_gameover;
		var ele_score;
		var speed_setting;
		
		var endtime=0;
		
		//全局设置
		//敌机出现时间间隔
		var dijitime=300;
		
		//敌机子弹速度
		var bullet1speed=300;
		
		//子弹类别
		var zidantype=0;
		
		//子弹数量
		var zidannumber=1;
		
		//子弹倾斜
		var zidanxie=0;
		
		//飞机生命
		var live=10;
		//document.getElementById("live_value").innerHTML = "生命值:10";
		
		//是否碰撞
		var ispengzhuang=0;
		
		//是否结束
		var isend=0;
		
		//道具持续时间
		var daojutime=3;
		
		//boss出现时间间隔
		var bosstime=dijitime/10;
		//var bosstime=5;
		
		//boss的生命值
		var bosslive=30;
		
		//boss的类型
		var bosstype=0;
		
		//道具持续时间
		var daojutime=dijitime/20;
		
		//是否胜利
		var issuccess=0;
		

		
		//var ctx = can.getContext("2d");
		
		var background1 = new Image() ;
		background1.src = "img/road7.png" ;
		
		var background2 = new Image() ;
		background2.src = "img/road8.png" ;
		
		var zidan1 = new Image() ;
		zidan1.src = "img/zidan1.png" ;
		
		var zidan2 = new Image() ;
		zidan2.src = "img/zidan2.png" ;
		
		var zidan1z = new Image() ;
		zidan1z.src = "img/zidan1z.png" ;
		
		var zidan2z = new Image() ;
		zidan2z.src = "img/zidan2z.png" ;
		
		var zidan1y = new Image() ;
		zidan1y.src = "img/zidan1y.png" ;
		
		var zidan2y = new Image() ;
		zidan2y.src = "img/zidan2y.png" ;
		
		var pengzhuang1 = new Image() ;
		pengzhuang1.src = "img/pengzhuang1.png" ;
		
		var pengzhuang2 = new Image() ;
		pengzhuang2.src = "img/pengzhuang2.png" ;
		
		var shengji1 = new Image() ;
		shengji1.src = "img/shengji1.png" ;
		
		var shengji2 = new Image() ;
		shengji2.src = "img/shengji2.png" ;
		
		var shengji3 = new Image() ;
		shengji3.src = "img/shengji3.png" ;
		
		var shengji4 = new Image() ;
		shengji4.src = "img/shengji4.png" ;
		
		var boss1 = new Image() ;
		boss1.src = "img/boss1.png" ;
		
		var boss2 = new Image() ;
		boss2.src = "img/boss2.png" ;

		var Imdiji1=new Image();
		Imdiji1.src="img/diji1.png";
		
		var Imdiji2=new Image();
		Imdiji2.src="img/diji2.png";
		
		var Imdiji3=new Image();
		Imdiji3.src="img/diji3.png";
		
		var success=new Image();
		success.src="img/success.png";
		
		
		var height=586;
		var newGame = function() {
			showScreen(0);
			screen_plane.focus();
			document.addEventListener("keydown", onkeydown);
			
				
			var plan=function(img,x,y){
				//如果包含敌机，或者设计飘雪之类的效果
				//可以：var classname=function(image,x,y,n){...}
				this.img = img;
				this.x = x;
				this.y = y;			
			}
			
			var shengji=function(img,x,y,type){
				this.img = img;
				this.x = x;
				this.y = y;	
				this.type=type;
			}
			
			shengji.prototype.draw = function (ctx) {
			   ctx.drawImage(this.img, this.x , this.y);
			   this.y+=1;	    
			};
			
			var diji1=function(img,x,y,type,live){
				this.img = img;
				this.x = x;
				this.y = y;	
				this.bullety=0;
				this.type=type;
				this.live=live;
				
			}
			
			diji1.prototype.draw = function (ctx) {
			   ctx.drawImage(this.img, this.x , this.y);
			   ctx.beginPath();
			   ctx.fill();
			   ctx.closePath();
			   this.y+=0.5;	    
			};
			
			var boss=function(img,x,y,type,live){
				this.img = img;
				this.x = x;
				this.y = y;	
				this.type=type;
				this.live=live;
				
			}
			
			boss.prototype.draw = function (ctx) {
			   ctx.drawImage(this.img, this.x , this.y);
			   ctx.beginPath();
			   ctx.fill();
			   ctx.closePath();
			   if(this.y<=0){
					this.y+=0.5;
				}
			};

			
			//给飞机类添加(属性和方法)绘制方法
			plan.prototype.draw = function (ctx) {
			   ctx.drawImage(this.img, this.x , this.y);
			};
			 //给飞机类添加(属性和方法)移动方法
			 plan.prototype.move = function (dx, dy) {
				 this.x += dx;
				 this.y += dy;
			 };
			 
			var img=new Image();
			img.src="img/plane2.png";
			myplane = new plan(img, 365, 400);
			
			
			
			//随机数函数
			function random(min, max) {
			  return Math.floor(Math.random() * (max - min)) + min;
			}
		
			var location1=0;
			var location2=-height;
			var isup=0;
			
			var chongzhi1=0;
			var zidantypetime=0;
			var zidanxietime=0;
			var zidandoubletime=0;
			
			//单位时间计算
			setInterval(function () {
				if(isend==0){
					endtime++;
					document.getElementById("time_value").innerHTML = endtime;
				}
				if(zidanxietime>0){
					zidanxietime--;
				}else{
					zidanxie=0;
				}
				if(zidantypetime>0){
					zidantypetime--;
				}else{
					bullettime=0;
					zidantype=0;
				}
				if(zidandoubletime>0){
					zidandoubletime--;
				}else{
					zidannumber=1;
				}
			}, 1000);
			//飞机，子弹，敌机，碰撞检测
			setInterval(function () {
				if(isup==0){
					ctx.drawImage(background1, 0, location1++) ;
					ctx.drawImage(background2, 0, location2++) ;
					if(location1==height){
						location1=-height;
					}
					if(location2==height){
						location2=-height;
					}
				}
				if(isup==1){
					ctx.drawImage(background1, 0, location1--) ;
					ctx.drawImage(background2, 0, location2--) ;
					if(location1==-height){
						location1=height;
					}
					if(location2==-height){
						location2=height;
					}
				}
				myplane.draw(ctx);
				
				//子弹与敌机碰撞检测并消除
				for (let i = bullets.length - 1; i >= 0; i--) {
					for (let j = diji1s.length - 1; j >= 0; j--) {
						var addwidth=0;
						if(diji1s[j].type==1){
							addwidth=30;
						}
						if(diji1s[j].type==2){
							addwidth=50;
						}
						if ((((bullets[i].x>diji1s[j].x) && (bullets[i].x<diji1s[j].x+50+addwidth)) || ((bullets[i].x-bullets[i].xie>diji1s[j].x) && bullets[i].x-bullets[i].xie<diji1s[j].x+50+addwidth) || ((bullets[i].x+bullets[i].xie>diji1s[j].x) && bullets[i].x+bullets[i].xie<diji1s[j].x+50+addwidth)) && (bullets[i].y>diji1s[j].y-15) && (bullets[i].y<diji1s[j].y+40) ){
							
							if(diji1s[j].live!=0){
								diji1s[j].live=diji1s[j].live-bullets[i].type-1;
								
							}
							//console.log(diji1s[j].live);
							if(diji1s[j].live<1){
								if(random(1,100)>60){
									var ran=random(1,80);
									//console.log(ran);
									if(ran<20){
										shengjis.push(new shengji(shengji1,diji1s[j].x+12, diji1s[j].y+35,1));
									}
									if(ran>20 && ran<40){
										shengjis.push(new shengji(shengji2,diji1s[j].x+12, diji1s[j].y+35,2));
									}
									if(ran>40 && ran<60){
										shengjis.push(new shengji(shengji3,diji1s[j].x+12, diji1s[j].y+35,3));
									}
									if(ran>60){
										shengjis.push(new shengji(shengji4,diji1s[j].x+12, diji1s[j].y+35,4));
									}
								}
								
								diji1s.splice(j, 1);
							}
							bullets.splice(i, 1); 
						}
					}
				}
				//子弹与boss碰撞检测并消除
				//console.log("bosses.length:"+bosses.length );
				if(bosses.length >1){
					bosses.length=1;
				}
				for (let i = bullets.length - 1; i >= 0; i--) {
					for (let j = bosses.length - 1; j >= 0; j--) {
						if(bosses[j].type==0){
							x=536;
							y=240;
						} 
						if(bosses[j].type==1){
							x=545;
							y=240;
						}
						
						if ((((bullets[i].x>bosses[j].x) && (bullets[i].x<bosses[j].x+x)) || ((bullets[i].x-bullets[i].xie>bosses[j].x) && bullets[i].x-bullets[i].xie<bosses[j].x+x) || ((bullets[i].x+bullets[i].xie>bosses[j].x) && bullets[i].x+bullets[i].xie<bosses[j].x+x)) && (bullets[i].y>bosses[j].y) && (bullets[i].y<bosses[j].y+y) ){
							//console.log("bosslive:"+bosses[j].live);
							if(bosses[j].live!=0){
								//console.log("yes");
								ctx.drawImage(pengzhuang1,280,bosses[j].y+100);
								bosses[j].live=bosses[j].live-bullets[i].type-1;
							}
							//console.log(diji1s[j].live);
							if(bosses[j].live<1){
				
								bosses.splice(j, 1);
								if(bosstype==0){
									bosstype=1;
								}else{
									bosstype=0;
								}
								issuccess=10*1000 / 120;
								bosstime=bosstime+endtime;
								bosslive=bosslive+10;
								
							}
							
							bullets.splice(i, 1); 
						}
						
					}
				}
				
				//敌机子弹与飞机的碰撞检测
				for (let i = bullet1s.length - 1; i >= 0; i--) {
					if ((((bullet1s[i].x>myplane.x) && (bullet1s[i].x<myplane.x+50)) || ((bullet1s[i].x-bullet1s[i].xie+15>myplane.x) && bullet1s[i].x-bullet1s[i].xie+15<myplane.x+50) || ((bullet1s[i].x+bullet1s[i].xie+15>myplane.x) && bullet1s[i].x+bullet1s[i].xie+15<myplane.x+50)) && (bullet1s[i].y>myplane.y+8) && (bullet1s[i].y<myplane.y+40) ){
						bullet1s.splice(i, 1); 
						ispengzhuang=1;
						live--;
						document.getElementById("live_value").innerHTML = live;
						if(live<1){
							showScreen(2);
							return;
						}
					}		
				}
				
				//敌机与飞机的碰撞检测
				for (let i = diji1s.length - 1; i >= 0; i--) {
					if (diji1s[i].x>myplane.x-10 && diji1s[i].x<myplane.x+20 && (diji1s[i].y>myplane.y-60) && (diji1s[i].y<myplane.y+40) ){
						diji1s.splice(i, 1); 
						ispengzhuang=1;	
						live--;
						document.getElementById("live_value").innerHTML = live;
						if(live<1){
							showScreen(2);
							return;
						}
					}		
				}
				
				//飞机与道具的碰撞检测
				for (let i = shengjis.length - 1; i >= 0; i--) {
					if (shengjis[i].x>myplane.x-30 && shengjis[i].x<myplane.x+40 && (shengjis[i].y>myplane.y-40) && (shengjis[i].y<myplane.y+40) ){
						if(shengjis[i].type==1){
							zidannumber=2;
							zidandoubletime=daojutime;
						}
						if(shengjis[i].type==2){
							bullettime=0;
							zidantype=1;
							zidantypetime=daojutime;
						}
						if(shengjis[i].type==3){
							bullettime=0;
							zidantype=2;
							zidantypetime=daojutime;
						}
						if(shengjis[i].type==4){
							zidanxie=1;
							zidanxietime=daojutime;
						}
						
						shengjis.splice(i, 1);
						
						
					}		
				}
				
				for (let i = diji1s.length - 1; i >= 0; i--) {
					if (diji1s[i].y > canvasHeight)
						diji1s.splice(i, 1); 
					else
						diji1s[i].draw(ctx);
				}	
				
				for (let i = bullet1s.length - 1; i >= 0; i--) {
					if (bullet1s[i].y > canvasHeight)
						bullet1s.splice(i, 1); 
					else
						bullet1s[i].draw(ctx);
				}	
				
				for (let i = bullets.length - 1; i >= 0; i--) {
					if (bullets[i].y < 0)
						bullets.splice(i, 1); 
					else
						bullets[i].draw(ctx);
				}
				
				for (let i = shengjis.length - 1; i >= 0; i--) {
					if (shengjis[i].y> canvasHeight)
						shengjis.splice(i, 1); 
					else
						shengjis[i].draw(ctx);
				}
				//console.log("bosses.length2:"+bosses.length );
				for (let i = bosses.length - 1; i >= 0; i--) {
					bosses[i].draw(ctx);
					//console.log("bosslive:"+bosses[i].live);
					ctx.fillRect(120,0,540*bosses[i].live/bosslive,20);
				}

				
			}, 1000 / 60);
			 
			var bullettime=0;
			var bullet1time=0;
			var diji1time=0;
			var pengzhuangtime=0;
			setInterval(function () {
				 bullettime++;
				 //console.log("zidantype:"+zidantype);
				 if(zidantype==0){
					 //console.log("bullettime:"+bullettime);
					 if(bullettime==40){
						bullets.push(new Bullet(myplane.x+25, myplane.y-10,4,0,zidannumber,zidanxie));
						bullettime=0;
					 }
				 }
				 if(zidantype==1){
					 if(bullettime==100){
						bullets.push(new Bullet(myplane.x+25, myplane.y-10,4,1,zidannumber,zidanxie));
					
						bullettime=0;
					 }
				 }
				 if(zidantype==2){
					 if(bullettime==70){
						bullets.push(new Bullet(myplane.x+25, myplane.y-10,4,2,zidannumber,zidanxie));
						bullettime=0;
					 }
				 }
				 
				 diji1time++;
				 if(diji1time==dijitime){
					 var randiji1 = random(100,canvasWidth-100);
					 var ran1=random(1,60);
					 //console.log(ran);
					 if(ran1<20){
					 	diji1s.push(new diji1(Imdiji1,randiji1,-68,0,3));
					 }
					 if(ran1>20 && ran1<40){
					 	diji1s.push(new diji1(Imdiji2,randiji1,-51,1,4));
					 }
					 if(ran1>40 && ran1<60){
					 	diji1s.push(new diji1(Imdiji3,randiji1,-77,2,5));
					 }
					 
					 //diji1s.push(new diji1(Imdiji1,randiji1,0));
					 diji1time=0;
				 }
				 bullet1time++;
				 if(bullet1time==bullet1speed){
					for (let i = diji1s.length - 1; i >= 0; i--) {
						if(diji1s[i].type==0){
							bullet1s.push(new Bullet1(diji1s[i].x+30, diji1s[i].y+65,4,0));
						}
						if(diji1s[i].type==1){
							bullet1s.push(new Bullet1(diji1s[i].x+30, diji1s[i].y+65,4,1));
						}
						if(diji1s[i].type==2){
							bullet1s.push(new Bullet1(diji1s[i].x+30, diji1s[i].y+65,4,2));
						}
					}	
					bullet1time=0;
				 }
			 
			 
				if(ispengzhuang==1){
					pengzhuangtime++;
					if(pengzhuangtime<50){
						ctx.drawImage(pengzhuang2, myplane.x+1, myplane.y+15) ;
					}
					else{
						ispengzhuang=0;
						pengzhuangtime=0;
					}
				} 
				
				// console.log("bosstime:"+bosstime);
				// console.log("endtime:"+endtime);
				var istrue=0;
				if(bosstime==endtime){
					//console.log("bosstype:"+bosstype);
					if(bosstype==0){
						if(istrue==0){
							bosses.push(new boss(boss1,120,-269,0,bosslive));
							//console.log("bosses.length:"+bosses.length );
						}
					}
					if(bosstype==1){
						bosses.push(new boss(boss2,120,-269,1,bosslive));
					}
					
				}
				
				if(issuccess>0){
					ctx.drawImage(success,120,100);
					issuccess--;
				}

			}, 1000 / 120);
				
			//子弹类
			var Bullet = function (x, y, r,type,numtype,xietype) {
				this.x = x;
				this.y = y;
				this.r = r;
				this.xie= 0;
				this.type=type;
				this.numtype=numtype;
				this.xietype=xietype;
			};	
			Bullet.prototype.draw = function (ctx) {
				ctx.beginPath();
				//console.log("bullettype:"+this.type);
				if(this.type==0){
					if(this.numtype==1){
						ctx.arc(this.x,this.y,this.r,0,2*Math.PI,false); 
					}
					if(this.numtype==2){
						ctx.arc(this.x-5,this.y,this.r,0,2*Math.PI,false); 
						ctx.arc(this.x+5,this.y,this.r,0,2*Math.PI,false);
					}
					if(this.xietype==1){
						ctx.arc(this.x-this.xie,this.y,this.r,0,2*Math.PI,false); 
						ctx.arc(this.x+this.xie,this.y,this.r,0,2*Math.PI,false); 
						this.xie++;
					}
					
				}
				if(this.type==1){
					if(this.numtype==1){
						ctx.drawImage(zidan1, this.x-8,this.y-30);
					}
					if(this.numtype==2){
						ctx.drawImage(zidan1, this.x-20,this.y-30);
						ctx.drawImage(zidan1, this.x,this.y-30);
					}
					if(this.xietype==1){
						ctx.drawImage(zidan1z, this.x-40-this.xie,this.y-30);
						ctx.drawImage(zidan1y, this.x-10+this.xie,this.y-30);
						this.xie++;
					}
				}
				if(this.type==2){
					if(this.numtype==1){
						ctx.drawImage(zidan2, this.x-20,this.y-10) ;
					}
					if(this.numtype==2){
						ctx.drawImage(zidan2, this.x-27,this.y-10);
						ctx.drawImage(zidan2, this.x-14,this.y-10);	
					}
					if(this.xietype==1){
						ctx.drawImage(zidan2z, this.x-30-this.xie,this.y-10) ;
						ctx.drawImage(zidan2y, this.x-10+this.xie,this.y-10) ; 
						this.xie++;
					}
				}
				
				ctx.fillStyle="#ffff00";
				ctx.fill();
				ctx.closePath();
				this.y=this.y-1;		    
			 };	
			 
			 var Bullet1 = function (x, y, r,type) {
				 this.x = x;
				 this.y = y;
				 this.r = r;
				 this.xie= 0;
				 this.type=type;
				 
			 };	
			 
			 Bullet1.prototype.draw = function (ctx) {
				ctx.beginPath();
				//ctx.arc(this.x,this.y+10,this.r,0,2*Math.PI,false);
				if(this.type==0){
					ctx.arc(this.x,this.y+10,this.r,0,2*Math.PI,false); 
				}
				if(this.type==1){
					ctx.arc(this.x+3,this.y-10,this.r,0,2*Math.PI,false); 
					ctx.arc(this.x+13,this.y-10,this.r,0,2*Math.PI,false);
				}
				if(this.type==2){
					ctx.arc(this.x+15,this.y+10,this.r,0,2*Math.PI,false);
					ctx.arc(this.x-this.xie+15,this.y+10,this.r,0,2*Math.PI,false); 
					ctx.arc(this.x+this.xie+15,this.y+10,this.r,0,2*Math.PI,false); 
					this.xie++;
				}
				ctx.fillStyle="#ff0000";
				ctx.fill();
				ctx.closePath();
				this.y=this.y+1;		    
			};	
			 
			 
			 
			var bullets = [];
			var bullet1s = [];
			var diji1s = [];
			var diji2s = [];
			var diji3s = [];
			var shengjis = [];
			var bosses = [];
			
				
			function onkeydown(e) {
			if (e.keyCode==37) {
				myplane.move(-10,0);
			}else if (e.keyCode==39) {
				myplane.move(10,0);
			}else if (e.keyCode==38) {
				myplane.move(0,-10);
			}else if (e.keyCode==40) {
				myplane.move(0,10);
			}else if (e.keyCode==13) {
				if(isup==1){
					isup=0;
				}
				else{
					isup=1;
				}
			}
		}
	}
	// 0 游戏界面
	// 1 菜单
	// 2 结束界面
	// 3 设置界面
	 
	var showScreen = function(screen_opt) {
	    switch (screen_opt) {
	        case 0:
	            screen_plane.style.display = "block";
	            screen_menu.style.display = "none";
	            screen_gameover.style.display = "none";
				screen_setting.style.display = "none";
				endtime=0;
				live=document.getElementById("livetian").value;
				isend=0;
	            break;
	        case 1:
	            screen_plane.style.display = "none";
	            screen_menu.style.display = "block";
	            screen_gameover.style.display = "none";
				screen_setting.style.display = "none";
	            break;
	        case 2:
	            screen_plane.style.display = "none";
	            screen_menu.style.display = "none";
	            screen_gameover.style.display = "block";
				screen_setting.style.display = "none";
				document.getElementById("live_value").innerHTML = 0;
				document.getElementById("endtime").innerHTML = endtime;
				isend=1;
	            break;
			case 3:
			    screen_plane.style.display = "none";
			    screen_menu.style.display = "none";
			    screen_setting.style.display = "block";
			    screen_gameover.style.display = "none";
			    break;
	    }
	}
	
	
	window.onload = function() {
	    canvas = document.getElementById("plane");
	    ctx = canvas.getContext("2d");
	
	    screen_plane = document.getElementById("plane");
	    screen_menu = document.getElementById("menu");
	    screen_gameover = document.getElementById("gameover");
		screen_setting = document.getElementById("setting");
		
		speed_setting = document.getElementsByName("speed");
	
	    button_newgame_menu = document.getElementById("newgame_menu");
	    button_newgame_setting = document.getElementById("newgame_setting");
	    button_newgame_gameover = document.getElementById("newgame_gameover");
		button_setting_menu = document.getElementById("setting_menu");
		button_setting_gameover = document.getElementById("setting_gameover");
		document.getElementById("live_value").innerHTML = live;

	    button_newgame_menu.onclick = function() {
	        newGame();
	    };
	    button_newgame_gameover.onclick = function() {
	        window.location.reload();
	    };
		button_newgame_setting.onclick = function() {
			live=document.getElementById("livetian").value;
			document.getElementById("live_value").innerHTML = live;
		    newGame();
		};
		button_setting_menu.onclick = function() {
		    showScreen(3);
		};

		for (var i = 0; i < speed_setting.length; i++) {
		    speed_setting[i].addEventListener("click", function() {
		        for (var i = 0; i < speed_setting.length; i++) {
		            if (speed_setting[i].checked) {
						dijitime=speed_setting[i].value;
						bullet1speed=speed_setting[i].value;
		            }
		        }
		    });
		}
			
	}
	</script>
	
</html>
